<template>
  <div>
    <div class="head f-row cp">
      <div
        class="head-left head-common"
        :class="{ 'active-head': activeTab == 1 }"
        @click="tapFn('/live/start')"
      >
        直播
      </div>
      <div
        class="head-right head-common"
        @click="tapFn('/live/record')"
        :class="{ 'active-head': activeTab == 2 }"
      >
        直播记录
      </div>
    </div>
    <router-view></router-view>
  </div>
</template>

<script>

import record from "@/views/live/record/record.vue";
export default {
  components: {
    record,
  },

  created() {},
  computed: {
    activeTab() {
      let name = this.$route.name;
      if (name == "liveIndex" || name == "liveEmit" || name == "liveAdd") {
        return 1;
      } else if (name == "liveRecord") {
        return 2;
      } else {
        return 3;
      }
    },
  },

  methods: {
    tapFn(e) {
      this.$router.push(e);
    },
   
  },
};
</script>

<style lang="less" scoped>
.active-head {
  font-weight: bold;
  color: #161616;
  font-size: 1.125rem;
  background: #ffffff;
}
.head-common {
  width: 7.5rem;
  height: 2.5rem;
  border-radius: 0.625rem 0.625rem 0 0;
  font-family: Source Han Sans SC;
  line-height: 2.5rem;
  text-align: center;
  color: #858484;
}
</style>